import React, {useState} from 'react';

interface Props {
  addTodo: AddTodo
}

export const AddTodoForm: React.FC<Props> = ({addTodo}) => {

  const [text, setText] = useState('');

  return (
    <form>
      <input 
        type="text" 
        placeholder="input something..." 
        value={text}
        onChange={e => {
          setText(e.target.value);
        }}/>

      <button 
        type="submit"
        onClick={e => {
          e.preventDefault();
          addTodo(text);
          setText('');
        }}
      >Add</button>
    </form>
  )
}